{% extends "layout.html" %}}
{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-md-5">
            <h2>Licenses distribution</h2>
            <canvas id="licenses-pie-chart" width="100%" height="100%"></canvas>
        </div>
        <div class="col-md-5 offset-md-2">
            <h2>Explore tags</h2>
            <div id="tags-cloud" class="text-justify"></div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-5">
            <h2>Languages distribution</h2>
            <canvas id="languages-pie-chart" width="100%" height="100%"></canvas>
        </div>
        <div class="col-md-5 offset-md-2">
            <h2>Organizations</h2>
            <canvas id="organizations-pie-chart" width="100%" height="100%"></canvas>
        </div>
    </div>
    <div class="row">
        <div class="col-md-5" id="activity">
            <h2>Projects activity</h2>
            <p class="text-muted">Repartition of projects activity.</p>
            <canvas id="activity-pie-chart" width="100%" height="100%"></canvas>
        </div>
        <div class="col-md-5 offset-md-2" id="submitters">
            <h2>Submitters</h2>
            <p class="text-muted">Number of projects submitted per contributor.</p>
            <canvas id="submitters-pie-chart" width="100%" height="100%"></canvas>
        </div>
    </div>
</div>
<script>
$(document).ready(function() {
    $.ajax({
        url: "{{ url_for('stats_bp.licenses',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(licenses) {
            var ctx = document.getElementById("licenses-pie-chart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: Object.keys(licenses),
                    datasets: [{
                        data: Object.values(licenses),
                        borderWidth: 1,
                        backgroundColor: colors.concat(_.times(Object.keys(licenses).length, pastelColorMaker))
                    }]
                },
                options: {
                    onClick: function(evt) {
                        var license_label = myChart.getElementsAtEvent(evt)[0]._model.label;
                        filters = [{"name":"name","op":"eq","val":license_label}];
                        $.ajax({
                            url: "{{ url_for('licenseapi0.licenseapi',) }}",
                            data: {"q": JSON.stringify({"filters": filters})},
                            dataType: "json",
                            contentType: "application/json",
                            success: function(licenses) {
                                if (licenses.num_results == 1) {
                                    window.location = '/projects?license='+licenses.objects[0].license_id;
                                }
                            }
                        });
                    }
                }
            });
        }
    });

    $.ajax({
        url: "{{ url_for('stats_bp.languages',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(languages) {
            var ctx = document.getElementById("languages-pie-chart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: Object.keys(languages),
                    datasets: [{
                        data: Object.values(languages),
                        borderWidth: 1,
                        backgroundColor: colors.concat(_.times(Object.keys(languages).length, pastelColorMaker))
                    }]
                },
                options: {
                    onClick: function(evt) {
                        var language_label = myChart.getElementsAtEvent(evt)[0]._model.label;
                        filters = [{"name":"name","op":"eq","val":language_label}];
                        $.ajax({
                            url: "{{ url_for('languageapi0.languageapi',) }}",
                            data: {"q": JSON.stringify({"filters": filters})},
                            dataType: "json",
                            contentType: "application/json",
                            success: function(languages) {
                                if (languages.num_results == 1) {
                                    window.location = '/projects?language='+languages.objects[0].name;
                                }
                            }
                        });
                    }
                }
            });
        }
    });

    $.ajax({
        url: "{{ url_for('stats_bp.tags',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(tags) {
            var max = Object.values(tags).reduce(function(a,b) {
                return Math.max(a, b);
            });
            for (tag in tags) {
                if (tag != '') {
                    $("#tags-cloud").append('<a href="/projects/?tag=' +
                                        tag + '" title="' + tags[tag] +
                                        ' project(s)"><font size=' +
                                        Math.min(1 + (tags[tag] * 7) / max, 7) +
                                        "' id='" + tag + "'>" +
                                        tag + "</font></a>&nbsp;");
                }
            }
        }
    });

    $.ajax({
        url: "{{ url_for('stats_bp.organizations',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(organizations) {
            var ctx = document.getElementById("organizations-pie-chart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: Object.keys(organizations),
                    datasets: [{
                        data: Object.values(organizations),
                        borderWidth: 1,
                        backgroundColor: colors.concat(_.times(Object.keys(organizations).length, pastelColorMaker))
                    }]
                },
                options: {
                    onClick: function(evt) {
                        var organization_type = myChart.getElementsAtEvent(evt)[0]._model.label;
                        window.location = '/organizations?type='+organization_type;
                    }
                }
            });
        }
    });

    $.ajax({
        url: "{{ url_for('stats_bp.activity',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(time_laps) {
            var ctx = document.getElementById("activity-pie-chart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: Object.keys(time_laps),
                    datasets: [{
                        data: Object.values(time_laps),
                        borderWidth: 1,
                        backgroundColor: colors.concat(_.times(Object.keys(time_laps).length, pastelColorMaker))
                    }]
                },
                options: {
                    onClick: function(evt) {
                        var before = new Date();
                        var after = new Date();
                        var timelaps = myChart.getElementsAtEvent(evt)[0]._model.label;
                        if (timelaps == "less than 1 month") {
                            after.setMonth(after.getMonth() - 1);
                            window.location = '/projects?updated_since='+after.toLocaleDateString();
                        }
                        if (timelaps == "between 1 and 3 months") {
                            before.setMonth(before.getMonth() - 1);
                            after.setMonth(after.getMonth() - 3);
                            window.location = '/projects?updated_since='+after.toLocaleDateString()+'&updated_before='+before.toLocaleDateString();
                        }
                        if (timelaps == "between 3 and 6 months") {
                            before.setMonth(before.getMonth() - 3);
                            after.setMonth(after.getMonth() - 6);
                            window.location = '/projects?updated_since='+after.toLocaleDateString()+'&updated_before='+before.toLocaleDateString();
                        }
                        if (timelaps == "between 6 months and 1 year") {
                            before.setMonth(before.getMonth() - 6);
                            after.setMonth(after.getMonth() - 12);
                            window.location = '/projects?updated_since='+after.toLocaleDateString()+'&updated_before='+before.toLocaleDateString();
                        }
                        if (timelaps == "between 1 and 2 years") {
                            before.setMonth(before.getMonth() - 12);
                            after.setMonth(after.getMonth() - 24);
                            window.location = '/projects?updated_since='+after.toLocaleDateString()+'&updated_before='+before.toLocaleDateString();
                        }
                        if (timelaps == "more than 2 years") {
                            before.setMonth(before.getMonth() - 24);
                            window.location = '/projects?updated_before='+before.toLocaleDateString();
                        }
                    }
                }
            });
        }
    });

    $.ajax({
        url: "{{ url_for('stats_bp.submitters',) }}",
        dataType: "json",
        contentType: "application/json",
        success: function(submitters) {
            var ctx = document.getElementById("submitters-pie-chart").getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: Object.keys(submitters),
                    datasets: [{
                        data: Object.values(submitters),
                        borderWidth: 1,
                        backgroundColor: colors.concat(_.times(Object.keys(submitters).length, pastelColorMaker))
                    }]
                },
                options: {
                    onClick: function(evt) {
                        var submitter = myChart.getElementsAtEvent(evt)[0]._model.label;
                        window.location = '/user/'+submitter;
                    }
                }
            });
        }
    });
});
</script>
{% endblock %}
